<template>
  <CommonTablePage
      :tableInfo="tableInfo"
      :insertTableInfo="insertTableInfo"
      :tableReqUrl="tableReqUrl"
      :stock="true"
      @onGetDeleteReqUrl="getDeleteReqUrl"
  >
  </CommonTablePage>
</template>

<script lang="ts" setup>
import {ref, reactive, onBeforeMount, provide} from "vue";
import CommonTablePage from "@/components/common/CommonTablePage.vue";
import axios from "axios";
import {insertOptions} from "@/utils";

// const searchValue = ref("");
const tableReqUrl = ref("/api/food")

const tableInfo = ref([
  {prop: "foodId", label: "编号"},
  {prop: "foodName", label: "名称"},
  {prop: "categoryName", label: "种类"},
  {prop: "foodPrice", label: "单价"},
  {prop: "foodStock", label: "库存"},
  {prop: "foodShelfLife", label: "保质期"},

]);

const categoryOptions = ref([])
const insertTableInfo = ref([
  {prop: "foodName", label: "名称"},
  {
    prop: "foodCategoryId", label: "种类", isSelect: true, select: {key: "categoryId", label: "categoryName",},
    options: categoryOptions.value
  },
  {prop: "foodPrice", label: "单价", isFloat: true},
  {prop: "foodShelfLife", label: "保质期", isDate: true},
]);

// 删除请求url
const getDeleteReqUrl = async ({value, reFun}) => {
  reFun(`${tableReqUrl.value}/${value.foodId}`);
};


const getCategoryOptions = async () => {
  const {data} = await axios.get("/api/foodCategory")
  insertOptions("foodCategoryId", data.data, insertTableInfo.value)

}


//@ts-ignore
onBeforeMount(() => {

  getCategoryOptions();

})
</script>

<style scoped>

</style>